<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>下拉树</title>
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/plugs/layui/css/layui.min.css">
    <link rel="stylesheet" type="text/css" href="https://tstatic.dgg.net/static/plugs/ztree/css/zTreeStyle/zTreeStyle.css"/>
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/css/dgg-iboss.min.css">
</head>
<body>
<div class="tree-select-warp">
    <input type="text" class="input-style"  name="aaa" id="selectTree" readonly  data-code="123" data-id="111,112" value="叶子节点111；"  />
</div>
<div class="tree-select-warp">
    <input type="text" class="input-style" id="selectTree12" data-id="叶子节点111" value="叶子节点111；" />
</div>
<div class="tree-select-warp">
    <input type="text" class="input-style"id="selectTree1"  data-id="叶子节点111" value="叶子节点111；"  />
</div>
<div class="tree-select-warp">
    <input type="text" class="input-style" id="selectTree3"  data-id="叶子节点111" value="叶子节点111；"  />
</div>

<a href="javscript:void(0)" class="layui-btn layui-btn-normal" onclick="getVal()">获取val</a>
<a href="javscript:void(0)" class="layui-btn layui-btn-normal" onclick="getValJson()">获取选中json</a>
<!--<a href="javscript:void(0)" class="layui-btn layui-btn-normal" onclick="getAllJson()">获取选中父级json</a>-->
<a href="javscript:void(0)" class="layui-btn layui-btn-normal" onclick="resetVal()">清空</a>
<script src="https://tstatic.dgg.net/static/plugs/jquery/jquery-1.9.1.min.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/ztree/js/jquery.ztree.all.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/ztree/js/jquery.ztree.select.js"></script>
<script>
    $('#selectTree').selectTree({
        check:true,   //默认为false，单选；设置为 true ，为多选
        code:'id',//指定获取id的字段名
        close:true,
        url:'tree.json',
        changeFun:function(){
            alert(1)
        },
        form:'true',
        idKey: "id",//指定id
        pIdKey: "pId",//指定pId
    });
    $('#selectTree12').selectTree({
        url:'tree.json',
        //check:true,   //默认为false，单选；设置为 true ，为多选
        code:'name',//指定获取id的字段名
//				form:'true'
//				url:"../json/tree.json",//请求路径
        close:true,
        idKey: "id",//指定id
        pIdKey: "pId",//指定pId
        changeFun:function(){
            alert(1)
        }
    });
    $('#selectTree1').selectTree({
        url:'tree.json',
        //check:true,   //默认为false，单选；设置为 true ，为多选
        code:'name',//指定获取id的字段名
        parentIsCheck:false,
        close:true
    });
    $('#selectTree3').selectTree({
        url:'tree.json',
        //check:true,   //默认为false，单选；设置为 true ，为多选
        code:'name',//指定获取id的字段名
        parentIsCheck:false,
        close:true
//				form:'true'
//				url:"../json/tree.json",//请求路径
//				idKey: "id",//指定id
//				pIdKey: "pId",//指定pId
    });

    function getVal(){
        alert($('#selectTree').val());
        // alert($('#selectTree').find("option:selected").text());
    }
    function resetVal() {
        $('#selectTree').selectTree('reset')
    }



    function getValJson() {
        var data=$('#selectTree').selectTree('getJson');
        alert(JSON.stringify(data))
    }
</script>
</body>
</html>